<template>
	<view class="main">
		<view class="user-header">
			<view class="user-text">我的</view>
		</view>
		<view class="user-bg">
			<image src="/static/img/user_bg.png"></image>
		</view>
		<view class="main-bg">
			<view class="main-body">
				<view class="newlist">
					<image :src="userInfo.avatarUrl||'/static/img/ar.png'" class="head-img"></image>
					<view class="newlist-flex">
						<view v-if="userInfo.nickName" class="head-num" style="padding-bottom:0">{{userInfo.nickName || '暂无昵称'}}</view>
					</view>
					<view class="newlist-flex">
						<button v-if="!userInfo.nickName" class="main-but" open-type="getUserInfo" @getuserinfo="wechatLogin">微信登录</button>
					</view>
				</view>
			
				<view class="car-wrapper">
					<view class="phone-wrapper">
						<view v-if="mobile" class="head-mobile" >{{mobile || '15578789898'}}</view>
						<button v-if="!mobile" class="iphone-but"  open-type="getPhoneNumber" @getphonenumber="getphonenumber">手机号授权</button>
					</view>
					<view class="main-head">
						<view class="head-item">
							<view class="head-num head-num1">{{Number(info.integral || 0).toFixed(2)}}</view>
							<view class="head-text" style="color: #3B4065;">可用积分</view>
						</view>
						<view class="head-item">
							<view class="head-num head-num1">{{info.total || 0}}</view>
							<view class="head-text" style="color: #3B4065;">累计收入（~）</view>
						</view>
						<view class="head-item">
							<view class="head-num head-num1">{{info.total || 0}}</view>
							<view class="head-text" style="color: #3B4065;">累计积分</view>
						</view>
					</view>
					
				</view>
				
				<view class="main-list">
					<view class="list-item" @click="hanldPartner()">
						<view class="list-left">
							<image src="/static/img/chak_icon.png"></image>
							<text v-if="info.areaid > 0">我是合伙人</text>
							<text v-else>招募合伙人</text>
						</view>
						
					</view>
					<view class="list-item" @click="hanldHorseMan()">
						<view class="list-left">
							<image src="/static/img/qishou.png"></image>
							<text>我是骑手</text>
						</view>
					</view>
					<view class="list-item" @click="hanldIntegral()">
						<view class="list-left">
							<image src="/static/img/jifen_ison.png"></image>
							<text>我的积分</text>
						</view>
						
					</view>
					<view class="list-item" @click="hanldmallOrder()">
						<view class="list-left">
							<image src="/static/img/xuanz-ison.png"></image>
							<text>商城订单</text>
						</view>
						
					</view>

					<view class="list-item" @click="hanldAddressList()">
						<view class="list-left">
							<image src="/static/img/add_ison.png" style="width: 50px"></image>
							<text>地址管理</text>
						</view>
						
					</view>
					
					<view class="list-item" @click="hanldShare()">
						<view class="list-left">
							<image src="/static/img/yan_icon.png"></image>
							<text>邀请好友</text>
						</view>
					
					</view>
					<view class="list-item" @click="hanldIdea()" >
						<view class="list-left">
							<image src="/static/img/wen_icon.png" style="width: 50px"></image>
							<text>意见反馈</text>
						</view>
						
					</view>
					<view class="list-item" @click="hanldAbout()" >
						<view class="list-left">
							<image src="/static/img/zhang_icon.png"  style="width: 50px"></image>
							<text>关于我们</text>
						</view>
					
					</view>
				</view>
			</view>
		</view>
		
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				info: {}, //小程序账号信息
				userInfo: {}, //微信个人信息
				code: '',
				mobile: '',
				isSubmit:false//是否提交
			}
		},
		created() {
			getApp().globalData.index = ''
			if (uni.getStorageSync('recyclingToken')) {
				this.getInfo()
			}
			if (uni.getStorageSync('wechatMobile')) {
				this.mobile = uni.getStorageSync('wechatMobile')
			}
			if (uni.getStorageSync('userInfo')) {
				this.userInfo = JSON.parse(uni.getStorageSync('userInfo'))
			}
		},
		methods: {
			getInfo() {
				this.$http.info().then(res => {
					console.log(res)
					this.info = res.data
					this.userInfo.avatarUrl = this.info.logo
					this.userInfo.nickName = this.info.nickname
					this.mobile = this.info.mobile
				})
			},
			getphonenumber(e) {
				// 获取用户信息
				let that = this
				that.encryptedData = e.detail.encryptedData
				that.iv = e.detail.iv

				if (!that.userInfo.nickName) {
					uni.showToast({
						title: '请先授权微信登录',
						icon: 'none'
					})
					return
				}
				uni.checkSession({
					success: function(res) {
						//session_key未过期
						let formDate = {
							encryptedData: that.encryptedData,
							iv: that.iv,
						}
						console.log(formDate)
						that.$http.bindmobile(formDate).then(res => {
							console.log(res)
							if (res.code == 0) {
								uni.showToast({
									title: '授权成功',
									icon: 'none'
								})
								that.mobile = res.data.mobile
								uni.setStorageSync('wechatMobile', res.data.mobile)
							} else {
								uni.showToast({
									title: res.msg,
									icon: 'none'
								})
							}
							console.log(res)
						})
					},
					fail: (err => {
						console.log(err)
						// session_key已过期
						// 进行登录操作
						uni.login({
							success(loginRes) {
								that.code = loginRes.code
								let formDate = {
									code: that.code,
									logo: that.userInfo.avatarUrl,
									nickname: that.userInfo.nickName,
									encryptedData: '',
									iv: '',
									mobile: '',
									invite: ''
								}
								that.$http.login(formDate).then(res => {
									console.log(res)
									uni.showToast({
										title: res.msg,
										icon: 'none'
									})
									if (res.code == 0) {
										uni.setStorageSync('recyclingToken', res.data.token)
										that.getInfo();
										setTimeout(() => {
											let formDate = {
												encryptedData: that.encryptedData,
												iv: that.iv,
											}
											console.log(formDate)
											that.$http.bindmobile(formDate).then(res => {
												console.log(res)
												if (res.code == 0) {
													uni.showToast({
														title: '授权成功',
														icon: 'none'
													})
													that.mobile = res.data.mobile
													uni.setStorageSync('wechatMobile', res.data.mobile)
												} else {
													uni.showToast({
														title: res.msg,
														icon: 'none'
													})
												}
												console.log(res)
											})
										}, 500)
									}
								})
							}
						})
					})
				})
			},
			//微信登录
			wechatLogin() {
				if(this.isSubmit){
					return false;
				}
				let that = this
				// let formDate = {
				// 	code: '12121',
				// 	logo: '',
				// 	nickname: '张三',
				// 	encryptedData: '',
				// 	iv: '',
				// 	mobile: '15570876120',
				// 	invite: ''
				// }
				// that.$http.login(formDate).then(res => {
				// 	uni.setStorageSync('recyclingToken', "yDdt57zTDutyCg+DWSktiA==")
				// 	uni.showToast({
				// 		title: res.msg,
				// 		icon: 'none'
				// 	})
				// 	// that.getInfo();
				// 	if (res.code == 0) {
				// 		that.userInfo = formDate
				// 		uni.setStorageSync('recyclingToken', res.data.token)
				// 		that.getInfo();
				// 	}
				// 	console.log(res)
				// })
				// return
				
				wx.login({
					success(loginRes) {
						console.log('loginRes====',loginRes)
						// 成功后进行登录,获取code
						if (loginRes.code) {
							that.code = loginRes.code
							//使用 wx.getSetting 获取用户当前的授权状态。
							that.isSubmit = true;
							wx.getSetting({
								success(res) {
									console.log('getSetting====',res)
									if (res.authSetting['scope.userInfo']) { //已授权=>getUserInfo
										// 获取用户信息
										wx.getUserInfo({
											// 获取信息成功
											success(userRes) {
												console.log("getUserInfo====",userRes);
												that.userInfo = userRes.userInfo;
												uni.setStorageSync('userInfo', JSON.stringify(that.userInfo))
												let formData = {
													code: that.code,
													logo: that.userInfo.avatarUrl,
													nickname: that.userInfo.nickName,
													encryptedData: '',
													iv: '',
													mobile: '',
													invite: ''
												}
												//user/Login
												that.$http.login(formData).then(res => {
													
													console.log(res)
													uni.showToast({
														title: res.msg,
														icon: 'none'
													})
													if (res.code == 0) {
														uni.setStorageSync('recyclingToken', res.data.token)
														that.getInfo();
													}else{
														wx.showModal({
															content: "登陆失败；" + JSON.stringify(res),
															confirmText: "确认",
															showCancel:false,
															success: (res) => {
																//点击“确认”时打开设置页面
																if (res.confirm) {} else {}
															}
														});
													}
													that.isSubmit = false;
												})
											},
											fail(err){
												wx.showModal({
													content:"getUserInfo err====" + JSON.stringify(err),
													confirmText: "确认",
													showCancel:false,
													success: (res) => {
														//点击“确认”时打开设置页面
														if (res.confirm) {} else {}
													}
												});
												console.log("getUserInfo err====",err);
											}
										})
									}
								},
								fail(err){
									wx.showModal({
										content:"getSetting err====" + JSON.stringify(err),
										confirmText: "确认",
										showCancel:false,
										success: (res) => {
											//点击“确认”时打开设置页面
											if (res.confirm) {} else {}
										}
									});
									console.log("getSetting err====",err);
								}
							})
						}
					},
					fail(err) {
						wx.showModal({
							content:"登录失败 err====" + JSON.stringify(err),
							confirmText: "确认",
							showCancel:false,
							success: (res) => {
								//点击“确认”时打开设置页面
								if (res.confirm) {} else {}
							}
						});
						console.log("登录失败 err === ",err);
					}
				})
				// // #ifdef H5
				
				// // #endif
			},
			//合伙人
			hanldPartner() {
				// if (this.info.areaid > 0) {
				// 	uni.navigateTo({
				// 		url: "/pages/member/partner2"
				// 	})
				// } else {
					uni.navigateTo({
						url: "/pages/member/partner"
					})
				// }
			},
			//我的积分
			hanldIntegral() {
				uni.navigateTo({
					url: '/pages/member/integral'
				})
			},
			//反馈
			hanldIdea() {
				uni.navigateTo({
					url: "/pages/member/idea"
				})
			},
			//关于我们
			hanldAbout() {
				uni.navigateTo({
					url: '/pages/member/about'
				})
			},
			//邀请好友
			hanldShare() {
				uni.navigateTo({
					url: '/pages/member/share'
				})
			},
			//地址列表
			hanldAddressList() {
				uni.navigateTo({
					url: `/pages/member/addressList?adds=${3}`
				})
			},
			//我是骑手
			hanldHorseMan() {
				this.submitClock();
				// uni.navigateTo({
				// 	url: `/pages/member/horseman/login`
				// })
				// let pushReservationTmplIds = 'ESdQBjGqexcntlasIjwgOE0CpwTgQsp4sCZSrAgwkL8'
				// let that = this

				// wx.getSetting({
				// 	withSubscriptions: true, //是否同时获取用户订阅消息的订阅状态，默认不获取
				// 	success: (res) => {
				// 		console.log(res)
				// 		if (res.subscriptionsSetting && res.subscriptionsSetting.itemSettings &&
				// 			res.subscriptionsSetting.itemSettings[pushReservationTmplIds] == "reject") {
				// 			//打开设置去设置
				// 			this.openConfirm('检测到您没打开推送权限，新任务将无法及时送达，是否去设置打开？')
				// 		} else {
				// 			wx.requestSubscribeMessage({
				// 				tmplIds: [pushReservationTmplIds],
				// 				success(res) {
				// 					console.log('提示：授权成功')
				// 					if (res[pushReservationTmplIds] === 'accept') {
				// 						that.submitClock();
				// 					} else if (res[pushReservationTmplIds] === 'reject') {
				// 						// 用户历史操作有设置了拒绝 or 关闭了订阅消息的主（总）开关，导致无法推送
				// 						// console.log(res, '0 拒绝 or 关闭了订阅消息的主（总）开关---');
				// 						// that.guideOpenSubscribeMessage(pushReservationTmplIds);
				// 						wx.showToast({
				// 							title: '授权订阅消息失败',
				// 							icon: 'none'
				// 						});
				// 						setTimeout(() => {
				// 							that.submitClock();
				// 						}, 1000)
				// 					} else {
				// 						wx.showToast({
				// 							title: '授权订阅消息有误',
				// 							icon: 'none'
				// 						});
				// 						setTimeout(() => {
				// 							that.submitClock();
				// 						}, 1000)
				// 					}
				// 				},
				// 				fail(res) {
				// 					console.log('提示：授权失败')
				// 					wx.showToast({
				// 						title: '授权订阅消息失败：' + res.errCode,
				// 						icon: 'none'
				// 					});
				// 					setTimeout(() => {
				// 						that.submitClock();
				// 					}, 1000)
				// 					// if (res.errCode == 20004) {
				// 					// 	// console.log(res, 'fail:用户关闭了主开关，无法进行订阅,引导开启---');
				// 					// 	// that.guideOpenSubscribeMessage();
				// 					// } else {

				// 					// }
				// 				}
				// 			})
				// 		}
				// 	}
				// })

			},
			//打开设置
			openConfirm(message) {
				let that = this
				wx.showModal({
					content: message,
					confirmText: "确认",
					cancelText: "取消",
					success: (res) => {
						//点击“确认”时打开设置页面
						if (res.confirm) {
							wx.openSetting({
								withSubscriptions: true,
								success: (res) => {
									console.log(res)
									setTimeout(() => {
										that.submitClock();
									}, 500)
								},
								fail: (error) => {
									setTimeout(() => {
										that.submitClock();
									}, 500)
									console.log(error)
								}
							})
						} else {
							wx.showToast({
								title: '取消授权订阅消息',
								icon: 'none'
							});
							setTimeout(() => {
								that.submitClock();
							}, 500)
							console.log('用户点击取消')
						}
					}
				});
			},
			submitClock() {
				if (uni.getStorageSync('riderStatus') == 2) {
					if (uni.getStorageSync('riderToken')) {
						uni.navigateTo({
							url: '/pages/member/horseman/Index'
						})
					} else {
						uni.navigateTo({
							url: '/pages/member/horseman/login'
						})
					}
				} else {
					this.$http.rider_apply_info().then(res => {
						console.log(res)
						if (res.data) {
							if (res.data.status == 2) {
								if (uni.getStorageSync('riderToken')) {
									uni.navigateTo({
										url: '/pages/member/horseman/Index'
									})
								} else {
									uni.navigateTo({
										url: '/pages/member/horseman/login'
									})
								}
							} else {
								uni.navigateTo({
									url: '/pages/member/horseman/horsemanApply'
								})
							}
						} else {
							uni.navigateTo({
								url: '/pages/member/horseman/horsemanApply'
							})
						}
					})
				}
			},
			guidSubscribeMessageAuthAfter(pushReservationTmplIds) {
				//引导用户 开启订阅消息 之后，「openSetting」 接口暂时不会返回，用户手动设置后的状态，所以采用「getSetting」接口重新进行查询
				let that = this
				wx.getSetting({
					withSubscriptions: true,
					success: res => {
						console.log(res)
						let {
							authSetting = {},
								subscriptionsSetting: {
									mainSwitch = false,
									itemSettings = {}
								} = {}
						} = res;

						if ((authSetting['scope.subscribeMessage'] || mainSwitch) && itemSettings[pushReservationTmplIds] === 'accept') {
							that.submitClock();
							// console.log('用户手动开启同意了，订阅消息');
						} else {
							uni.showToast({
								title: '您没有同意授权订阅消息，新任务将无法通知到您',
								icon: 'none'
							})
							setTimeout(() => {
								that.submitClock();
							}, 1000)
						}
					}
				});
			},
			guideOpenSubscribeMessage(pushReservationTmplIds) {
				//引导用户，手动引导用户去设置页开启，
				let that = this
				uni.showModal({
					title: '提示',
					content: '检测到您没有开启订阅消息的权限，有新任务将无法通知到您，是否去设置？',
					success: function(res) {
						if (res.confirm) {
							that.guidSubscribeMessageAuthAfter(pushReservationTmplIds);
						} else if (res.cancel) {
							uni.showToast({
								title: '您已拒绝订阅消息授权，新任务将无法通知到您',
								icon: 'none'
							})
							setTimeout(() => {
								that.submitClock();
							}, 1000)
						}
					}
				});
			},
			//商城订单
			hanldmallOrder() {
				uni.navigateTo({
					url: '/pages/member/mallOrder/index'
				})
			},
			ontrueGetList() {
				uni.showToast({
					title: '第2个页面'
				})
				console.log("加载了第五个页面，可以把网络请求放这里")
			},
			lower() {
				uni.showToast({
					title: 'scroll-view的加载更多'
				})
				console.log("分页数据可以放这里~~~~~~嘿嘿")
			}
		}
	}
</script>

<style lang="scss" scoped>
	button::after {
		border:none
	}
	.main{
		background-color: #FAFAFA;
		display: block !important;
		position: relative;
		width: 100%;
	}
	
	.head-num1{
		padding-bottom: 1px !important;
	}
	.car-wrapper{
		display: flex;
		    flex-direction: column;
		    align-items: center;
			border-radius: 20upx 20upx 0 0;
			background-color: #fff;
			margin: 18upx 15px 0upx 15px;
			position: relative;
			height: 150px;
			border-bottom: 1px solid #E5EBF1;
			position: relative;
	}
	.car-buttom{
		    position: absolute;
		    bottom: -20px;
	}
	.car-boay{
		width: 320upx;
		height: 80upx;
		background: linear-gradient(124deg, #6AA7E8 0%, #3D9AFD 100%);
box-shadow: none;
		font-size: 14px;
		color: #fff;
		text-align: center;
		line-height: 80upx;
	}
	.newlist-flex{
		display: flex;
		flex-direction: column;
	}
	.list-left{ 
		display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
	.newlist{
		    display: -webkit-box;
		    display: -webkit-flex;
		    display: flex;
		    flex-direction: row;
		    align-items: center;
		    justify-items: center;
		    justify-items: center;
		     justify-content: end;
		    width: 100%;
			margin-top: 9px;
			position: absolute;
			top:-80px;
			z-index: 99;
	}
	.user-header {
		text-align: center;
		height: 44px;
		font-size: 16px;
		color: #111110;
		font-weight: bold;
		line-height: 44px;
		width: 100%;
		background-color: #fff;
		/* padding-bottom: 100px; */
		z-index: 9999;
		padding-top: 20px;
	}

	.main-bg {
		width: 749upx;
		height: 475upx;
		position: absolute;
		top:170px

	}

	.main-body {
		
		flex-direction: column;
		align-items: center;
		width: 100%;
		// margin: 70px 15px 100px 15px;
		// border-radius: 10px;
		// padding-bottom: 20px;
	}

	.head-img {
		width:200upx;
		height: 200upx;
		border-radius: 50%;
		margin-left: 42px;
		margin-right: 8px;
	}

	.main-but {
		width: 260upx;
		height: 80upx;
	
	background-color: rgba(255,255,255,0.4);
		
		border-radius: 46upx;
		color: #fff;
		line-height: 40px;
		text-align: center;
		font-size: 18px;
		font-weight: bold;
		margin: 0;
		margin-bottom: 17px;
	}
	.iphone-but{
		margin: 0;
		width: 285upx;
		height: 80upx;
		line-height: 40px;
		text-align: center;
		font-size: 14px;
		font-weight: bold;
		color: #fff;
		
		background: linear-gradient(124deg, #6AA7E8 0%, #3D9AFD 100%);
		box-shadow: 0px 10upx 12upx 0px #B2D0FF;
		border-radius: 46upx 0 0upx 46upx;
		
	}
	.user-bg image{
		width: 100%;
		height: 492upx;
	}
	.phone-wrapper{
		position: absolute;
		right: -20px;
		top:13px
	}

	.main-head {
		display: flex;
		flex-direction: row;
		width: 100%;
		align-items: center;
		text-align: center;
		justify-content: space-around;
position: absolute;
		bottom: 20px;
	}

	.head-num {
		font-size: 23px;
		color: #101010;
		font-weight: bold;
		padding-bottom: 15px;
	}

	.head-mobile {
		font-size: 20px;
		color: #101010;
		position: absolute;
		right: 40px;
	}

	.head-text {
		color: #3B4065;
		font-size: 14px;
	}

	.list-left image {
		width: 50px;
		height: 50px;
		vertical-align: middle;
	}

	.list-left text {
		color: #121212;
		font-size: 14px;
		margin-top: 13px;
	}



	.main-list {
		    display: -webkit-box;
		    display: -webkit-flex;
		    display: flex;
		  background-color: #fff;
		    flex-direction: row;
		    flex-wrap: wrap;
			    margin: 0 15px;
	}


	.list-item:nth-of-type(1) {
	}

	.list-item {
		    display: flex;
		    flex-direction: column;
		    justify-content: space-between;
		    padding: 14px 0;
		    align-items: center;
		    width: 25%;
	}
	
	
	
	/**/
	.cash {
		height: 226px;
		width: 548upx;
		background-color: #fff;
		border-radius: 10px;
		text-align: center;
		padding: 0 25px;
		position: relative;
	}
	
	.cash-but {
		display: flex;
		flex-direction: row;
		justify-content: space-around;
		margin-top: 50px;
	}
	
	.cash-title {
		color: rgba(48, 52, 76, 1);
		font-weight: bold;
		font-size: 23px;
		padding: 20px 0;
	}
	
	.cash-text {
		color: #666666;
		text-align: left;
		font-size: 14px;
	}
	
	.cash-left {
		width: 555upx;
		height: 88upx;
	
background: linear-gradient(124deg, #6AA7E8 0%, #3D9AFD 100%);

box-shadow: 0px 2px 4px 0px #1E75FF;
		border-radius: 48upx;
		text-align: center;
		line-height: 88upx;
		color: #fff;
		font-size: 18px;
		font-weight: bold;
	}
	
	.cash-right {
		width: 228upx;
		height: 34px;
		background: rgba(255, 95, 73, 1);
		border-radius: 5px;
		color: #fff;
		font-size: 14px;
		line-height: 34px;
	}
	
	.cash-img {
		width: 54px;
		height: 54px;
		margin-top: -54upx;
	}
	
	.cash-guan {
		width: 21px;
		height: 21px;
		position: absolute;
		right: 20px;
		top: 20px;
	}
	
</style>
